<template>
  <div>
    <!-- 选择校区 -->
    <el-select
      v-model="value"
      @change="handleChange"
      placeholder="请选择校区"
      style="width: 100%"
      clearable
      filterable
      :disabled="disabled"
    >
      <el-option
        v-if="type == 2"
        v-for="item in options"
        :key="item.id"
        :label="item.name"
        :value="item.code"
      >
      </el-option>
      <el-option
        v-if="type == 1"
        v-for="item in options"
        :key="item.id"
        :label="item.name"
        :value="item.id"
      >
      </el-option>
    </el-select>
  </div>
</template>
<script>
import { tbDeptQuery } from '@/api/admin/user/department-manage.js'
export default {
  data() {
    return {
      value: [],
      options: [],
    }
  },
  props: {
    defaultValue: String,
    defaultCode: String,
    disabled: {
      type: Boolean,
      default: false,
    },
    //type: 1.id  2.code
    type: {
      type: String,
      default: '1',
    },
  },
  watch: {
    defaultValue(v) {
      this.value = v
    },
  },
  mounted() {
    this.value = this.defaultValue || this.defaultCode
    this.getList()
  },
  methods: {
    getList() {
      tbDeptQuery({ pId: '0' }).then((res) => {
        this.options = res.data.data[0].childList.filter((v) => v.type == 1)
      })
    },
    handleChange(value) {
      let obj
      if (this.type == 1) {
        obj = this.options.filter((v) => v.id == value)
      } else {
        obj = this.options.filter((v) => v.code == value)
      }
      this.$emit('emit', obj[0])
    },
  },
}
</script>